<template>

  <div>

    <data-table
      ref="pagingTable"
      :options="options"
      :list-query="listQuery"
      @multi-actions="handleActions"
    >
      <template #filter-content>
        <dic-list-select v-model="listQuery.params.auditState" title="选择审核状态" dic-code="qu_report_audit_state"/>
        <el-input v-model="listQuery.params.title" title="搜索试题" class="filter-item" size="small" placeholder="搜索试题内容" style="width: 200px" />
      </template>

      <template #data-columns>

        <el-table-column
          label="试题"
          show-overflow-tooltip>
          <template v-slot="{row}">
            <detail-link :id="row.quId" :title="row.quContentShort" to="QuUpdate" permission="qu:update" />
          </template>
        </el-table-column>

        <el-table-column
          show-overflow-tooltip
          label="题型"
          align="center"
          width="120px"
          prop="quType_dictText"/>

        <el-table-column
          label="所属题库"
          show-overflow-tooltip>
          <template v-slot="{row}">
            <detail-link :title="row.repoTitle" :query="{repoId: row.repoId}" to="QuList" permission="qu:list" />
          </template>
        </el-table-column>

        <el-table-column
          label="纠错理由"
          show-overflow-tooltip>
          <template v-slot="{row}">
            <detail-link :id="row.id" :title="row.content" @click="handleAudit(row.id)" />
          </template>
        </el-table-column>

        <el-table-column
          show-overflow-tooltip
          label="纠错人"
          align="center"
          width="120px"
          prop="createBy_dictText"/>

        <el-table-column
          show-overflow-tooltip
          label="提交时间"
          align="center"
          width="180px"
          prop="createTime"/>

        <el-table-column
          label="审核状态"
          width="100px"
          align="center">
          <template v-slot="{row}">
            <span :class="{'success':row.auditState===1, 'danger':row.auditState===2, 'info':row.auditState===0}">
              {{ row.auditState_dictText }}
            </span>
          </template>
        </el-table-column>

        <el-table-column
          label="审核人"
          align="center"
          width="120px"
          prop="auditBy_dictText"
        />

        <el-table-column
          show-overflow-tooltip
          label="审核理由"
          prop="auditMsg"
        />

        <el-table-column
          align="center"
          label="奖励积分"
          width="100px">
          <template v-slot="{row}">
            <span v-if="row.auditState===1">{{ row.auditPoints }}</span>
            <span v-else>--</span>
          </template>
        </el-table-column>

      </template>

    </data-table>

    <report-audit-dialog :visible.sync="auditVisible" :ids="auditIds" @callback="handleRefresh"/>
    <report-view-dialog :visible.sync="viewVisible" :id="viewId" @callback="handleRefresh"/>
  </div>

</template>

<script>
import ReportViewDialog from '@/views/admin/repo/qu/components/ReportViewDialog.vue'
import ReportAuditDialog from '@/views/admin/repo/qu/components/ReportAuditDialog.vue'

export default {
  components: { ReportAuditDialog, ReportViewDialog },
  data() {
    return {
      listQuery: {
        current: 1,
        size: 10,
        params: {

        }
      },

      options: {

        // 可批量操作
        multi: true,
        // 审核过的不允许选择
        selectable(row) {
          return row.auditState === 0
        },
        delete: {
          enable: true,
          permission: 'qu:report:delete',
          url: '/api/qu/report/delete'
        },
        // 列表请求URL
        listUrl: '/api/qu/report/paging',
        // 批量操作列表
        multiActions: [
          {
            value: 'audit',
            label: '审核',
            permission: 'qu:report:audit'
          }]
      },
      auditVisible: false,
      auditIds: [],
      viewVisible: false,
      viewId: null
    }
  },
  methods: {

    // 批量审核
    handleActions(event) {
      if (event.opt === 'audit') {
        this.auditIds = event.ids
        this.auditVisible = true
      }
    },

    // 查看详情
    handleAudit(id) {
      this.viewId = id
      this.viewVisible = true
    },

    // 刷新列表
    handleRefresh() {
      this.$refs.pagingTable.getList()
    },

    toRepo(repoId) {

    }
  }
}
</script>

